var VocabularyTeacher = ( function() {

	function VocabularyTeacher(params) {
		this.mParams = params;
		this.mFileSystem = fs;
		this.mUi = new ui.UI($('#ui'));
	}

	VocabularyTeacher.prototype.init = function() {
		var self = this;
		self.mConsole = new Console(
			self,
			self.mUi.init("Vocabulary Teacher "),
			[new GuessWordQuiz(self)]
		);

		fs.initGlobal(this.mParams.languagesRootURL);
        fs.initLocal();
        //the Console element will call fs.initDropbox
        self.mLanguages = new languages.Languages(self.mFileSystem);
        self.mLanguages.init()
        .then(function() {
            return self.mConsole.init();
        })
        .then(function() {
            self.mNewLessonPanel = new ExercisePanel(self, "Start New Lesson");
            self.mNewLessonPanel.on('opening', function() {
                var consoleParams = self.mConsole.currentChoice();
                self.mNewLessonPanel.load(consoleParams);
            });
            self.mNewLessonPanel.on('closed', function() {
                self.mNewLessonPanel.clear();
            });
        })
        .fail(function(error) {
            alert("Couldn't init because of error: "+error);
        });
	}

    VocabularyTeacher.prototype.languages = function() {
        return this.mLanguages.languages();
    }





	var KExercisePanelContents = "<div id=\"languageDiagnosticsContainer\"></div><div id=\"exerciseSandbox\"></div>"
    function ExercisePanel(application, title) {
        ui.Panel.call(this, application.mUi, title, {
        	add 	: true,
        	redraw 	: true
        });
        ui.Panel.prototype.contentElement.call(this).append(KExercisePanelContents);
    }
    ExercisePanel.prototype.__proto__ = ui.Panel.prototype;

    ExercisePanel.prototype.contentElement = function() {
        return ui.Panel.prototype.contentElement.call(this).find('#exerciseSandbox');
    }

    ExercisePanel.prototype.load = function(params) {
		this.setTitle(params.language.name()+" * "+params.exercise.name());
		this.exercise = params.exercise;
        params.language.begin({
            diagnostics : ui.Panel.prototype.contentElement.call(this).find('#languageDiagnosticsContainer')
        });
		this.exercise.load(this, params.language);
    }

	return VocabularyTeacher;
})();